<template>
  <div class="home">
    <div class="facebox">
      <img :src="userinfo.faceimage" />
    </div>
    <div style="margin-bottom:20px">
      {{userinfo.email}}
    </div>
    <van-button type="primary" block @click="$router.push('/addresslist')">前往地址列表</van-button>
  </div>
</template>

<script>
import {getUserInfo} from "@/api"
export default {
  data(){
    return {
      userinfo:{}
    }
  },
  mounted() {
    // 获取个人信息
    getUserInfo().then(res => {
      this.userinfo = res.data.data;
    })
  },
}
</script>

<style scoped>
  .home{
    text-align: center;
    box-sizing: border-box;
    padding: 30px;
  }
  .facebox{
    width: 100px;
    height: 100px;
    border-radius: 50%;
    overflow: hidden;
    margin: 30px auto;
    background: #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .facebox img{
    max-width: 100%;
    max-height: 100%;
  }
</style>